<template>
	<div id="notice_add_edit">
		<div class="form">
			<div class="row">
				<label class="label">
					<span>*</span>
					通知标题
				</label>
				<el-input v-model="param.title" id="title" style="width: 3rem;" maxLength="30" 
					      placeholder="" clearable></el-input>
				&nbsp;
				<span class="tips">支持1-30个汉字，字母，数字，符号输入</span>
			</div>
			
			<div class="row">
				<label class="label">
					<span>*</span>
					通知内容
				</label>
				<el-input type="textarea" class="textarea" :rows="5" id="content" v-model="param.content"
					      placeholder="" maxLength="300" style="width: 6rem;">
				</el-input>
				<div class="tips" style="padding-left: 1.1rem;">
					支持1-300个汉字，字母，数字，符号输入
				</div>
			</div>
			<div class="row">
				<label class="label">
					<span>*</span>
					发送给
				</label>
				<template v-if="param.receiverType!=null">
					<span>{{targetMap[param.receiverType]}}</span>
					<br/>
					&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&nbsp;
				</template>
				<el-button type="primary" @click="openSelect()" 
					style="height: 0.36rem;padding-top: 0.1rem;">
					请选择
				</el-button>
			</div>
			
		</div>
		<div class="btn_div">
			<div class="btn_sure" @click="sure(0)">保 存</div>
			<div class="btn_sure" @click="sure(1)">保存并发送</div>
			<div class="btn_cancel" @click="cancel()">取 消</div>
		</div>
		
		<el-dialog title="选择发送目标" :visible.sync="selectVisible" width="6.4rem"
			:close-on-click-modal="false" append-to-body>
			<selectTarget ref="selectTarget" @cancel="selectVisible=false" @ok="selectOk"></selectTarget>
		</el-dialog>
	</div>
</template>

<script>
import selectTarget from './notice_select_target'

var vm,dict;
var param = {
	title : "",
	content : "",
	type : 1,
	isPublish: 0,
	receiverIdList: [],
	receiverType: null,
	_wait : ""
}
export default {
	components : {
		selectTarget
	},
	data : function() {
		return {
			param : {},
			targetMap: { 0: "全部校区", 1: "指定校区", 2: "指定校区人员"},
			selectVisible: false,
			isAdd: true
		}
	},
	methods : {
		init : function(notice) {
			//编辑
			if(notice) {
				vm.param = tool.clone(notice);
				vm.isAdd = false;
			} else {
				vm.param = tool.clone(param);
				vm.isAdd = true;
			}
		},
		cancel : function() {
			vm.$emit('cancel');
		},
		sure : function(isPublish) {
			//验证规则
			var rules = [{
				judge : vm.param.title,
				focus : $("#notice_add_edit #title"),
				tips : tips.blank
			}, {
				judge : vm.param.content,
				focus : $("#notice_add_edit #content"),
				tips : tips.blank
			}, {
				judge : vm.param.receiverType!=null,
				tips : "请选择发送目标"
			}];
			
			if(!tool.validate(rules,true)) {
				return;
			}
			
			//设置更新状态
			vm.param.isPublish = isPublish;
			let message = (isPublish==1? "通知发送成功" : "通知保存成功");
			//新增或编辑操作
			if(vm.isAdd) {
				api.messageAdd(vm.param).then(function(data) {
					tool.message({ showClose: true, message, type: 'success' });
					vm.$emit('cancel');
					vm.$emit('ok');
				});
			} else {
				api.messageUpdate(vm.param).then(function(data) {
					tool.message({ showClose: true, message, type: 'success' });
					vm.$emit('cancel');
					vm.$emit('ok');
				});
			}
		},
		openSelect : function() {
			vm.selectVisible = true;
			//解析提交数据成选择数据
			let type = vm.param.receiverType;
			let checkList = [];
			//全部校区
			if(type == 0) {
				checkList = [0];
			}
			//部分校区
			if(type == 1) {
				for(let item of vm.param.receiverIdList) {
					checkList.push(item.campusId);
				}
			}
			//部分用户
			if(type == 2) {
				for(let item of vm.param.receiverIdList) {
					checkList.push(item.campusId + ":" + item.userId);
				}
			}
			vm.$nextTick(function() {
				vm.$refs.selectTarget.init(checkList);
			});
		},
		selectOk : function(data) {
			let list = [];
//			//解析选择数据成提交数据
			data.idList.forEach(function(item) {
				//全部校区
				if(data.type == 0) {
					list = null;
				}
				//部分校区
				if(data.type == 1) {
					list.push({
						campusId: item.id
					});
				}
				//部分用户
				if(data.type == 2) {
					list.push({
						campusId: item.id.split(":")[0],
						userId: item.id.split(":")[1]
					})
				}
			});
			//接受者类型
			vm.param.receiverType = data.type;
			vm.param.receiverIdList = list;
		}
	},
	created : function() {
		vm = this;
		dict = tool.getItem(lsKey.dict,true);
	}
}
</script>
<style lang="scss">
#notice_add_edit {
	.el-textarea__inner {
		font-size: 0.16rem;
		font-family: "微软雅黑";
	}
}
</style>
<style scoped src="@/style/module/dialog_button.css"></style>
<style scoped>
	.form {
		font-size: 0.16rem;
		color: #666666;
	}
	.tips {
		font-size: 0.14rem;
		color: #999999;
	}
	.row {
		line-height: 0.36rem;
		padding: 0.07rem 0;
	}
	.label {
		width: 0.9rem;
		display: inline-block;
		text-align: right;
		margin-right: 0.12rem;
		vertical-align: top;
	}
	.label>span {
		color: red;
		display: inline-block;
		width: 0.1rem;
		position: relative;
		top: 0.02rem;
	}
	.textarea {
		width:5rem;
		padding: 0.07rem 0 0rem 0;
	}
</style>